@keyframes tick-tock {
    to {
        transform: rotate(360deg);
    }
}
@-webkit-keyframes tick-tock {
    to {
        transform: rotate(360deg) translate3d(0, 0, 0);
    }
}
// -通用配置--
body{
    font-size: 12px;
}
a{
    text-decoration: none;
}
.site-nav{
    width: 100%;
    font-size: 12px;
    color: #5e5e5e;
    background-color: #f1f1f1;
   
}
.content{
    width: 1190px;
    margin: 0 auto;
    // background-color: orange;
}
//------------------
//--顶部快速导航--
.site-nav-l{
    float: left;
    height: 36px;
    line-height: 36px;
    li{
        float: left;
        padding: 0 10px;
        .shoucang{
            cursor: pointer;
            height: 36px;
            
            em{
                display: inline-block;
                width: 15px;
                height: 20px;
                background:url(http://s.maiyaole.com/images/201306/images/common_sprite.png) no-repeat right -63px;
                margin-top:10px ;
            }
            a{
                vertical-align: top;
            }
           
        } 

        .diqu .province{
            cursor: pointer;
            display: inline-block;
            padding: 0 15px 0px 5px ;
            background:url(../img/common_sprite.png) no-repeat right 18px;
        }
        .diqu .province:hover{
            background:url(../img/common_sprite.png) no-repeat right -8px;
        }
    }
    li:first-child { 
        background:url(../img/common_sprite.png) no-repeat right -178px; 
     }
    
}

.site-nav-r{

    float: right;
    height: 36px;
    line-height: 36px;
    li{
        float: left;
        padding: 0 10px;
        background-image: url(../img/common_sprite.png);
        background-position: right -178px;
        background-repeat: no-repeat;
        a{
            text-decoration: none;
            display: inline-block;
            height: 36px;
            color:#5e5e5e;
            
        }    
    }
    .regandgin{
        a:nth-of-type(1){
            color:#e54948;
        }
    }
    .my1haodian{
         a{
             display: inline-block;
             padding: 0 15px 0 0 ;
             background:url(../img/common_sprite.png) no-repeat right 18px;
         }
         a:hover{
            background:url(../img/common_sprite.png) no-repeat right -8px;
         }
    }
    
    .telphone span{
            color:#c7a774;
            font-weight: bold;
        }
    .phoneapp em{
        display: inline-block;
        width: 9px;
        height: 20px;
        background:url(../img/common_sprite.png) no-repeat right -108px;
        margin: 8px 5px 0 0;

        

    }
    .phoneapp span{
        vertical-align: top;
    }
    
}
//-------------------
//--搜索框栏目--
.yao-head{
    .yao-head-content{
        position: relative;
    }
    margin-bottom:10px ;
    // background-color: pink;
    .logo{
      float: left;
      width: 180px;
      margin-top: 26px;
      margin-right:105px;
        
        a{
            text-indent: -999px;
            display: block;
            width: 180px;
            height: 61px;
            background:url(http://s.maiyaole.com/images/common/logo_01.png) no-repeat;
           
        }
    }
    .search{
        float: left;
        width: 778px;
        height: 106px;
        // background-color: #888;
        .searchForm{
            margin-top:34px; 
            input{
                float: left;
                box-sizing: border-box;
                width: 435px;
                height: 46px;
                padding: 0 10px;
                font-size: 16px;
                outline: none;
                border: 1px solid #c7a774;
                
            }
            input::placeholder{
                font-size: 12px;
                color:#999;
            }
            button{
                float: left;
                width: 82px;
                height: 46px;
                vertical-align: middle;
                border: 1px solid #c7a774;
                margin-left: -1px;
                outline: none;
                cursor: pointer;
                background-color: #fff;
            }
        }
        .hotkeys{
            margin-top:10px; 
           a{
               margin-right:15px; 
               color: #5e5e5e;
           }
        }
    }
    .erDcode{
        position: absolute;
        top: 30px;
        right:180px;
     }
     .tocart{
         position: absolute;
         top: 30px;
         right:0;
         height: 36px;
         line-height: 36px;
         border: #999 1px solid;
     }
     .tocart::before{
        content:'';
        display: inline-block;
        height: 36px;
        width: 36px;
        background: url('http://s.maiyaole.com/images/201306/images/common_sprite.png?t==20141218d') no-repeat right 0;
        background-position: 10px -312px;
        vertical-align: top;
        margin-right:10px; 
     }
     .tocart::after{
        content:'';
        display: inline-block;
        height: 36px;
        width: 50px;
        background: url('http://s.maiyaole.com/images/201306/images/common_sprite.png?t==20141218d') no-repeat right 0;
        background-position: -111px -312px;
        vertical-align: top;


     }
}
//-------------------
//---二级框及导航----
.navmain{
    position: relative;
    border-bottom: 2px solid #d2b994;
    .allshop{
        float: left;
        display: block;
        width: 180px;
        height: 48px;
        background-color:#19323a;
        color:#fff;
        text-align: center;
        line-height: 48px;
        font:400 15px/48px tahoma,arial,Microsoft YaHei ;
        text-indent: -55px;
        font-weight: bold;
        }
    }
    .mainlist{
        float: left;
        li{
            float: left;
            padding: 0 15px;
            a{
                display: block;
                font-size: 16px;
                height: 48px;
                line-height: 48px;
                color:#505050;
            }
        }
    }
    .allshop_list{
        position: absolute;
        top: 50px;
        left: 0;
        height: 400px;
        background-color: #314349;
        li{ 
            position: relative;
            
            a{
                display: block;
                width: 180px;
                height: 40px;
                background-color: #314349;
                color: #fff;
                text-align: center;
                line-height: 40px;
                font-size: 14px;
                text-indent: -25px;
                i{
                    font-size: 20px;
                    float: left;
                    margin-left:35px 
                }
                h4{
                    float: left;
                    margin-left:35px 
                }
                
            }    
        }
    }
    .navmain-box{
        position: relative;

    }
.erjik{
    display: none;
    position: absolute;
    z-index: 96;
    width: 1009px;
    height: 400px;
    border: #aaa 1px solid;
    border-left: transparent 1px solid;
    border-top:0; 
    top: 49px;
    left: 179px;
    background-color: #fff;
    
}
.erjik_content {
    display: none;
    position: absolute;
    z-index: 100;
    top: 1px;
    left: 0;
    
    .erjik_content_img{
        float: left;
        width: 252px;
        height: 400px;
        border-left:1px solid #999;
        a{
            display: block;
            width: 250px;

        }
        img{
            display: block;
            width: 250px;
            border-bottom: 1px solid #999;
            cursor: pointer;
        }
        .noborder{
            border: none;
        }
        
        
    }
    .erjik_content_temp{
        float: left;
        .mode-bd{
            width: 252px;
            padding:15px 0; 
        }
    } 
}

.mode-bd dl{
        overflow: hidden;
        dt{
            margin: 6px 0 0 23px;
            line-height: 20px;
            height: 20px;
            font-weight: 700;
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
        }
        dd{
            color: #999;
            line-height: 1.6;
            margin: 0 0 0 23px;
            padding: 0 0 6px 0;
            text-overflow: ellipsis;
            overflow: hidden;
            em{
                margin: 8px 6px 0 -8px;
                padding: 1px 6px 0 7px;
                display: inline-block;
                font-style: normal;
                border-left: #ddd 1px solid;
                font-weight: 400;
                line-height: 1;
                a{
                    color: #000;
                }
                a:hover{
                    color:red;
                    text-decoration: underline;
                }

            }
        }
}
//--------------
//----banner广告栏-----
.navbody{
    .m-banner{
        position: relative;
        float: left;
        width: 750px;
        height: 400px;
        margin-left: 180px;
        overflow: hidden;
        .bannermove{
            position: relative;
            width: 2250px;
            height: 400px;
        }
        a{
            position: absolute;
            top:0;
            left: 0;
            width: 750px;
            height: 400px;
            img{
                width: 100%;
                height: 100%;
            }
        }
        a:nth-of-type(2){
            position: absolute;
            top:0;
            left: 750px;
            width: 750px;
            height: 400px;
            img{
                width: 100%;
                height: 100%;
            }
        }
        a:nth-of-type(3){
            position: absolute;
            top:0;
            left: 1500px;
            width: 750px;
            height: 400px;
            img{
                width: 100%;
                height: 100%;
            }
        }
        ol{
            position: absolute;
            width: 62px;
            height: 16px;
            margin-left:-31px; 
            top: 94%;
            left: 50%;

            
            li{
                float: left;
                width:16px ;
                height: 16px;
                margin-right:15px; 
                border-radius: 50%;
                background-color: #3e535a;
                cursor: pointer;
            }
        }
    }
    .r-banner{
        float: left;
        width: 260px;
        height: 400px;
        font: 12px tahoma,arial,"Microsoft Yahei",\5b8b\4f53;
        color: #707070;
        .r-banner-t1{
            height: 31px;
            line-height: 31px;
            h3{
                float: left; 
                margin: 0 10px;
                border-bottom: 1px solid transparent;
            }
            
        }
        .r-banner-t1-content1{
            
            width: 245px;
            height: 125px;
            margin-left:13px ;
            font-size: 13px;
            line-height: 25px;
            a{
                float: left;
                color: #707070;
                width: 72px;
                margin-right:5px ;
            }
            a:hover{
                text-decoration: underline;
            }
            a:after{
                content: '';
                display: inline-block;
                width: 6px;
                height: 10px;
                margin-left:5px; 
                background:url('http://s.maiyaole.com/images/201306/images/just_index.png') no-repeat;
               background-position: -15px -452px ;
            }


        }
        .r-banner-t1-content2{
         
            width: 245px;
            height: 115px;
            padding-top: 10px ;
            font-size: 13px;
            text-align: center;
            
            .pic1 {
                float: left;
                width: 72px;
                margin: 0 40px;
                
                p{
                    width: 72px;
                    height: 72px;
                    background: #fff url("http://s.maiyaole.com/images/201612/icon_4.png")
                    no-repeat;
                }
                h3{
                    margin-top:10px ;
                }
            }
            .pic2{
                float: left;
                width: 72px;
                p{
                    width: 72px;
                    height: 72px;
                    background: #fff url("http://s.maiyaole.com/images/201612/icon_3.png")
                    no-repeat;
                }
                h3{
                    margin-top:10px ;
                }
            }
        }
        .pic3{
            display: block;
            height: 50px;
            img{
                width: 100%;
                height: 100%;
            }
        }
        .erweima{
            
            h4{
                padding-top: 10px;
                padding-left:8px ;
                font-weight: 800;
                color: #000;
            }
            .erweima-img li{
                float: left;
                position: relative;
                margin: 10px 8px;
                 
                img{
                    width: 44px;
                    height: 44px;
                    border-radius:5px;
                    margin-right:8px ;
                    cursor: pointer;
                }
                img:nth-of-type(2){
                    position: absolute;
                    width: 88px;
                    height: 88px;
                    top: -100px;
                    left: -22px;
                    display: none;
                }
            }
        }
        .r-banner-t2{
            ul{
                line-height: 16px;
                font-size: 12px;
                color: black;
                
                li{
                    float: left;
                    margin-left:10px; 
                    cursor: pointer;    
                }
                li:nth-of-type(1){
                    font-weight: 700;
                    border-bottom: 1px solid red;
                }
            }
            .zhengban{
                border-bottom: solid 1px #d2b994;
                
                a{
                    float: left;
                    height: 84px;
                    width: 55px;
                    margin-right:10px ;
                    text-align: center;
                    i{
                        display: block;
                        margin: 10px 10px ;
                        width: 40px;
                        height: 40px;
                        background:url("http://s.maiyaole.com/images/201306/images/icon_gonggao.png")no-repeat ;
                        background-position: -42px -44px;
                    }
                  
                }

            }
            .gonggao {
                display: none;
                height: 74px;
                margin-top: 10px;
                font-size: 12px;
                line-height: 23px;
                border-bottom: #c7a774 solid 1px;
                p{
                    white-space: nowrap;
                    overflow: hidden;
                    text-overflow:ellipsis;
                    a{
                        color:#000;
                    }
                }
            }
            .baoxian{
                display: none;
                height: 74px;
                margin-top: 10px;
                font-size: 12px;
                line-height: 23px;
                border-bottom: #c7a774 solid 1px;
                p{
                    white-space: nowrap;
                    overflow: hidden;
                    text-overflow:ellipsis;
                    a{
                        color:#000;
                    }
                }
            }
           

        }
    }
}
.b-banner{
    margin: 10px auto;
    >a{
        float: left;
        width: 250px;
        height: 150px;
        img{
            width: 100%;
            height: 100%;
        }
    }
    >a:nth-of-type(1){
        position: relative;
        width: 180px;
        height: 150px;
        background:url('http://s.maiyaole.com/images/201306/img/clock01.png');
        .clock{
            position: absolute;
            top: 32px;
            left: 63px;
            width: 40px;
            height: 40px;
            border-radius: 50%;
            border: 6px solid transparent;
            .clock-h{
                position: absolute;
                top: 5px;
                left: 19px;
                height: 18px;
                width: 5px;
                background: url('http://s.maiyaole.com/images/201306/img/clock_h.png') no-repeat;
                transform-origin: 2.5px 16.5px;
                transform: rotate(60deg);
            }
            .clock-m{
                position: absolute;
                top: 1.5px;
                left: 19px;
                height: 19px;
                width: 5px;
                background: url('http://s.maiyaole.com/images/201306/img/clock_m.png') no-repeat;
                transform-origin: 2.5px 19.5px;
                animation: tick-tock 36s steps(60, end) infinite;
            }
            .clock-s{
                position: absolute;
                top: 1.5px;
                left: 18px;
                height: 5px;
                width: 5px;
                border-radius:50%; 
                background-color: #fff;
                transform-origin: 2.5px 19.5px;
                animation: tick-tock 6s steps(60, end) infinite;
            }
        }
        .clock::after{
            position: absolute;
            top: 18px;
            left: 18px;
            content: '';
            width: 7px;
            height: 7px;
            border-radius: 50px;
            background-color: #fff;
        }
    }
}
//-----------------
//---主体部分----
.body-content{
    .content1{
        border-top: 2px solid #92c4ff;
        margin-bottom:30px;
    }
    .left-nav{
        float: left;
        width: 180px;
        h2{
            height: 85px;
            line-height: 85px;
            background: #92c4ff;
            color: #fff;
            font-size: 20px;
            text-align: center;
        }
        .list{
            width: 180px;
            li{
                float: left;
                width: 89px;
                height: 50px;
                line-height: 50px;
                font-size: 14px;
                text-align: center;
                border-left: 1px solid #F3F3F3;
                border-right: 1px solid #F3F3F3;
                border-bottom: 1px solid #F3F3F3;
                a{
                    color:#999;
                }
            }
            li:nth-of-type(even){
                border-left:0;
                border-right: 0;
            }
        }
    }
    
    .product{
        float: left;
        width: 1007px;
        height:492px;
        border-bottom:1px solid #f3f3f3; 
        border-right:1px solid #f3f3f3; 
        .pro-banner{
            float: left;
        }
        .pro-banner2{
            float: left;
            a{
                float: left;
            }
        }
        .pro-b{
            li{
                float: left;
                width: 160px;
                height: 178px;
                padding: 20px 20px 10px 20px;
                border-right: 1px solid #f3f3f3; 
                a{
                    padding-top:15px ;
                    display: block;
                    text-align: center;
                }
                h3{
                    font-size: 14px;
                    height: 20px;
                    margin: 15px 0 5px;
                    line-height: 20px;
                    color: #333;
                    overflow: hidden;
                    text-overflow:ellipsis;
                    white-space: nowrap;
                }
                p{
                    color: #e72418;
                    font-size: 16px;
                    text-align: center;
                }
            }
            :last-child{
                border-right:0; 
            }
           
        }

    }
}
//--------------
//---友情链接-------
.friend{
    ul{
        background-color: #f8f8f8;
        border: 1px solid #e6e6e6;
        height: 33px;
        li{
            float: left;
            height: 33px;
            padding: 0 55px;
            border-right:1px solid #e6e6e6;    
            font-size: 12px;
            line-height: 33px;
            text-align: center;
            cursor: pointer;
        }
        li:hover{
            background-color:white;
            border-bottom:1px solid white;
            font-weight: 800;
        }
    }
    .pingpai{
        border: 1px solid #e6e6e6;
        border-top:0; 
        width: 1188px;
        padding: 10px 0;
        a{
            float: left;
            width: 118px;
            height: 53px;
            text-indent: -1999px;
           background: url('http://s.maiyaole.com/images/201306/images/img_btm_logo.png');
        }
        a:hover{
           opacity: 0.7;
        }
    }
    .lianjie{
        padding:10px 0 ;
        border: 1px solid #e6e6e6;
        border-top:0; 
        a{
            float: left;
            width: 132px;
            height: 26px;
            line-height: 26px;
            text-align: center;
            color:#888;
        }
    }
}
//---------------
//---foot----------
.baozheng{
    padding-top:62px ;
}
.lianxi{
    margin-top:60px ;
    ul{
        float: left;
        margin-left: 105px;
    }
    li{
        float: left;
        width: 255px;
        font-size: 15px;
        img{
            float: left;
            width: 94px;
            height: 94px;
            margin-right:15px; 
        }
        h3{
            margin-top:27px; 
            line-height: 25px;
            font-weight: 700;
        }
        p{
            font-size:12px;
            color: #999;
        }
    }

    .tel{
        float: left;
        height: 94px;
        width: 255px;
        text-align: center;
        line-height: 20px;
        color: #999;
        font-size: 12px;
        border-left:1px #ccc solid; 
        :first-child{
            margin-top:20px ;
            font-size: 20px;
            color: #c7a774;
            font-weight: 700;
            line-height: 30px;
        }
    }
}
.yiyaowan-box{
    background-color: #f0f0f0;
    margin-top:50px ;
    padding:45px 0 30px 0 ;
}
.yiyaowan {
    img{
        float: left;
        margin-top: 25px;
    }
    .help{
       float: left;
        dl{
            float: left;
            font-size: 12px;
            line-height: 26px;
            color: #999;
            padding-bottom:35px ;
       border-bottom: 1px solid #ccc;
            dt{
                font-size: 15px;
                color: #1c1c1c;
                font-weight: 700;
                line-height: 30px;
            }
            dd{
                width: 155px;
                a{
                    color:#999;
                }
            }
        }
        dl:first-child{
            margin-left:100px ;

        }
    }
}
.yiyaojituan-box{
    background-color: #f0f0f0;
    margin-top:0px ;
    .jituanlogo{
            float: left;
    }
    .yiyaojituan-body{
        float: right;
        width: 995px;
        li{
            float: left;
            width: 270px;
            height: 56px;
            line-height: 56px;
            font-size: 14px;
            font-weight: 700;
            

            img{
                float: left;
                height: 56px;
                width: 56px;
            }
        }
        .munber{
            margin:30px 0 ;
            :first-child{
                width: auto;
                font-size: 12px;
                margin-right: 15px;
                font-weight: normal;
            }
        }
        p{
            margin-left:-20px ;
            line-height: 30px;
            color:#555;
            a{
                font-size: 12px;
                color:#555;
                display: inline-block;
                margin: 0 20px;   
            }
            a:hover{
                text-decoration: underline; 
                color:#000;
            }
            
        }
        h5{
            color:#999;
            line-height: 20px;
            a{
                color:#999;
            }
            a:before{
                content: '';
                display: inline-block;
                width: 20px;
                height: 20px;
                background: url('http://s.maiyaole.com/images/201306/images/copy_ico.png') no-repeat 0 0;
                vertical-align: top;
                margin: 0 5px;
            }
        }
        .verify{
            margin: 15px 0 35px 0;
            a{
                float: left;
                width: 90px;
                height: 35px;
                margin-right: 7px;
                background:url('http://s.maiyaole.com/images/201306/img/outherLogo_min.png');
                background-repeat: no-repeat;
                background-position: 0 0;
                text-indent: -9999px;
                opacity: 0.5;
            }
            a:hover{
                opacity: 1;
            }
        }
        
    }
    
}






